import { computed, ref } from 'vue'
import { Pagination } from '#/antd'
import {
  fetchMaterialList,
  MaterialApi,
  removeMaterialAtlas,
} from '@/api/premium/content/material'
import { AtlasItem } from '@/api/premium/content/model/atlasModel'
import { formatPagination, formatRequestPage } from '@/utils/antdOpFormatHelper'
import {
  QueryMaterialRequest,
  RemoveMaterialAtlasRequest,
} from '@/api/premium/content/model/materialModel'
import { useStore } from '@/store'
import { message } from 'ant-design-vue'
import { MaterialItem } from '@/components/ItemList/MaterialList/types'

const useAtlasDetailDrawer = () => {
  const store = useStore()
  const drawerVisiable = ref<boolean>(false)
  const currentAtlasItem = ref<AtlasItem>()
  const currentAtlasMaterialList = ref<MaterialItem[]>([])
  const currentAtlasMaterialPageInfo = ref<Pagination>({
    pageSize: 10,
    total: 0,
    current: 1,
  })

  const getCurrentAtlasMaterialList = async () => {
    if (currentAtlasItem.value) {
      const requestData: QueryMaterialRequest = {
        atlasId: currentAtlasItem.value.id,
        ...formatRequestPage(currentAtlasMaterialPageInfo.value),
      }
      const { data } = await fetchMaterialList(requestData)
      currentAtlasMaterialList.value = data.records
      currentAtlasMaterialPageInfo.value = formatPagination(data)
    } else {
      currentAtlasMaterialList.value = []
    }
  }
  const fetchMaterialListLoading = computed(() =>
    store.getters['global/isOpLoading'](MaterialApi.GET_MATERIAL_LIST)
  )

  const openDrawer = async (atlasItem: AtlasItem) => {
    currentAtlasMaterialPageInfo.value.current = 1
    currentAtlasItem.value = atlasItem
    await getCurrentAtlasMaterialList()
    drawerVisiable.value = true
  }

  const deleteMaterialInAtlas = async (material: MaterialItem) => {
    if (currentAtlasItem.value) {
      const reqData: RemoveMaterialAtlasRequest = {
        materialId: material.id,
        data: [currentAtlasItem.value.id],
      }
      await removeMaterialAtlas(reqData)
      message.success('移除成功')
      await getCurrentAtlasMaterialList()
    } else {
      message.error('当前图集信息有问题, 请检查！')
    }
  }
  const removeMaterialAtlasLoading = computed(() =>
    store.getters['global/isOpLoading'](MaterialApi.REMOVE_MATERIAL_ATLAS)
  )

  const currentAtlasMaterialPageChange = async (page: number) => {
    currentAtlasMaterialPageInfo.value.current = page
    await getCurrentAtlasMaterialList()
  }

  const currentAtlasMaterialPageSizeChange = async (
    current: number,
    pageSize: number
  ) => {
    currentAtlasMaterialPageInfo.value.current = current
    currentAtlasMaterialPageInfo.value.pageSize = pageSize
    await getCurrentAtlasMaterialList()
  }

  return {
    drawerVisiable,
    openDrawer,
    currentAtlasItem,
    currentAtlasMaterialList,
    fetchMaterialListLoading,
    currentAtlasMaterialPageInfo,
    currentAtlasMaterialPageChange,
    currentAtlasMaterialPageSizeChange,
    deleteMaterialInAtlas,
    removeMaterialAtlasLoading,
    getCurrentAtlasMaterialList,
  }
}
export default useAtlasDetailDrawer
